﻿<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="StockByCategories.aspx.cs" Inherits="FalconSystemCatalogWebsite.Pages.StockByCategories" %>

<!DOCTYPE html>

<link href="../Css/FalconSystemCatalogStyles.css" rel="stylesheet" />
<link href="../Css/metro-bootstrap.css" rel="stylesheet" />

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Lista de productos</title>
    <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server">
        <script type="text/javascript">

            function SearchBox_OnKeyPress() {
                var txtSearchBox = document.getElementById("txtSearchBox");
                var treeList = $find('<%= CategoriesRadTreeView.ClientID %>');


                for (var i = 0; i < treeList.get_nodes().get_count() ; i++) {
                    findNodes(treeList.get_nodes().getNode(i), txtSearchBox.value);
                }
            }

            function findNodes(node, searchString) {
                var hasFoundChildren = false;

                if (hasFoundChildren || node.get_text().toLowerCase().indexOf(searchString.toLowerCase()) != -1) {
                    node.set_selected(true);
                }

                for (var i = 0; i < node.get_nodes().get_count() ; i++) {
                    hasFoundChildren = findNodes(node.get_nodes().getNode(i), searchString) || hasFoundChildren;
                }

                if (hasFoundChildren || node.get_text().toLowerCase().indexOf(searchString.toLowerCase()) != -1) {
                    node.set_visible(true);

                    node.expand();
                    if (node.get_text().toLowerCase().indexOf(searchString.toLowerCase()) != -1) {
                        node.set_selected(true);
                        for (var i = 0; i < node.get_nodes().get_count() ; i++) {
                            DisplayChildren(node);
                            //node.get_nodes().getNode(i).set_visible(true);
                        }
                    }
                    return true;
                }
                else {
                    node.set_visible(false);
                    return false;
                }
            }

            function DisplayChildren(node) {
                for (var ee = 0; ee < node.get_nodes().get_count() ; ee++) {
                    node.get_nodes().getNode(ee).set_visible(true);
                    //node.get_nodes().getNode(ee).set_expanded(true);
                    DisplayChildren(node.get_nodes().getNode(ee));
                }
            }

        </script>
    </telerik:RadScriptBlock>
</head>
<body>
    <form id="form1" runat="server">
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server"></telerik:RadScriptManager>
        <telerik:RadFormDecorator ID="RadFormDecorator1" runat="server"/>
        <div>
            <table>
                <tr>
                    <td>

                        <fieldset>
                        <legend>
                            Categorías
                        </legend>
                        <div class="metro">
                            <div class="input-control text">
                                <input id="txtSearchBox" onkeyup="SearchBox_OnKeyPress()" type="text" placeholder="Buscador ..." autocomplete="off" />
                                <button class="btn-clear" onclick="SearchBox_OnKeyPress()"></button>
                            </div>
                        </div>
                        <telerik:RadTreeView ID="CategoriesRadTreeView" runat="server"></telerik:RadTreeView>
                            </fieldset>    
                    </td>
                    <td>
                        <telerik:RadListView ID="StockRadListView" runat="server" ItemPlaceholderID="ProductsContainer" Width="100%" Height="100%">
                            <LayoutTemplate>
                                <fieldset>
                                    <legend>Productos</legend>
                                    <asp:PlaceHolder ID="ProductsContainer" runat="server"></asp:PlaceHolder>
                                </fieldset>
                            </LayoutTemplate>
                            <ItemTemplate>
                                <fieldset>
                                    <legend><%#Eval("Name")%></legend>
                                    <telerik:RadBinaryImage ID="StockPreviewBinaryImage" Width="100px" runat="server" DataValue='<%# GetStockImage(Eval("StockId")) %>' />
                                    <br />
                                    <asp:Label ID="lblStockName" runat="server" Text='<%# Eval("Name") %>'></asp:Label>
                                </fieldset>
                            </ItemTemplate>
                        </telerik:RadListView>
                    </td>
                </tr>
            </table>

        </div>
    </form>
</body>
</html>
